import React, { useContext } from 'react';
import dayjs from 'dayjs';

import { GlobalContext } from '@/context';
;
// import { ContentType, FilterType, Status } from './constants';
import styles from './index.module.less';
import { Button, Col, Form, Row, Space } from 'antd';
import { ClearOutlined, SearchOutlined } from '@ant-design/icons';


const marginBottom = (children: any = [], index) => {
  console.log('index[', index)
  console.log('index[---', children.length)
  return index > 3 && (children.length <= index && children.length - 3 >= index) ? 0 : 12
}
function SearchForm(props: {
  submit: () => void;
  reset: () => void;
  children?: React.ReactNode;
  // locale: Record<string, string>;
  form: any;
}) {
  const { children } = props


  const handleSubmit = () => {

    props.submit();
  };

  const handleReset = () => {

    props.reset();
  };

  return (
    <div className={styles.searchFormWrapper}>
      <Form
        form={props.form}
      
        labelAlign="left"

        wrapperCol={{ span: 18 }}
      >
        <Row>
          <Col flex='auto'>
            <Row gutter={24}>
              {
                React.Children.map(children, (item: any, index: number) => {

                  return <Col span={6}  >
                    {item}
                  </Col>
                })
              }


            </Row></Col>
          <Col flex='70px'>
            <Space >
              <Button
              icon={<SearchOutlined />}
              type="primary" onClick={handleSubmit}>
                查询
              </Button>
              <Button
                icon={<ClearOutlined />}
              onClick={handleReset}>
                重置
              </Button>
            </Space>
          </Col>
        </Row>
      </Form>

    </div>
  );
}

export default SearchForm;